<template>
  <div id="amap" class="data-v-amap"></div>
</template>

<script>
export default {
  name: "data-v-amap",
  props: ["config"],
  mounted() {
    this.initMap();
  },
  methods: {
    initMap() {
      let mapConfig = {
        mapStyle: "amap://styles/d93c1e0568c62d488cf0bd91476b5f87",
        zoom: 10
      };

      Object.assign(mapConfig, this.config);

      // eslint-disable-next-line no-undef
      let map = new AMap.Map("amap", mapConfig);

      map.on("complete", () => {
        this.$emit("map-ready", map);
      });
    }
  }
};
</script>